<template>
  <div class="background-layout full-screen">
    <render-layout ref="render"></render-layout>
  </div>
</template>

<script setup lang="ts">
import { inject, watch, ref } from 'vue'
import renderLayout from '../components/renderLayout.vue'

const screenStyle: any = inject('screen-style')

const render = ref<InstanceType<typeof renderLayout> | null>(null)

watch(screenStyle, (val) => {
  render.value?.updateFrame()
})
</script>

<style lang="scss">
.background-layout {
  canvas {
    height: 100%;
    width: 100%;
  }
}
</style>
